<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>我的签约</title>
<link rel="stylesheet" type="text/css"
	href="/bootstrap/bootstrap.4.1.0.css">
<script src="/bootstrap/jquery.3.2.1.min.js"></script>
<script src="/bootstrap/popper.12.5.min.js"></script>
<script src="/bootstrap/bootstrap.4.1.0.min.js"></script>
<script src="/layui/layer/layer.js"></script>
<script src="/vue/Vue.js"></script>
<script src="/vue/axios.js"></script>
<style type="text/css">
.active {
	background-color: blue;
}
</style>
<script type="text/javascript">
	$(function(){
		$("#header").load("/zlz/header.html");
	})
</script>
</head>
<body>
	<div id="header" >
	</div>
	<div id="all" class="container">
		<div v-if="signs!=null">
				<table class="table table-striped table-hover text-center">
				<thead>
					<tr>
						<th>序号</th>
						<th>场馆名称</th>									
						<th>微信</th>
						<th>qq</th>
						<th>电话</th>
						<th>场馆地址</th>
						<th>描述</th>
						<th>签约状态</th>
						<th>操作</th>
					</tr>
				</thead>
				<tbody>
					<tr v-for="(sign,index) in signs" :key="index" :class="{success: sign.sginStatus==3}">
						<td>{{index+1}}</td>
						<td>{{sign.user.nickname}}</td>
						<td>{{sign.user.wechat}}</td>
						<td>{{sign.user.qq}}</td>
						<td>{{sign.user.phone}}</td>
						<td>{{sign.user.address}}</td>
						<td>{{sign.user.description}}</td>
						<td >
						<b v-if="sign.sginStatus==1" class="text-warning">签约申请中</b>
						<b v-if="sign.sginStatus==2" class="text-primary">向您招聘中</b>
						<b v-if="sign.sginStatus==3" class="text-success">签约成功</b>
						<b v-if="sign.sginStatus==4" class="text-danger">签约失败</b>
					
						</td>
						<td>
						<button	class="btn btn-outline-primary" v-if="sign.sginStatus==1&&sign.readed" @click="remindAccept(sign)"  :disabled="sign.reminded">{{sign.remindAccept}}</button>
						<button	class="btn btn-outline-success" v-if="sign.sginStatus==2&&sign.readed" @click="accept(sign)"  :disabled="sign.reminded">{{sign.accept}}</button>
						<button	class="btn btn-outline-danger" v-if="sign.sginStatus==2&&sign.readed" @click="refuse(sign)"  :disabled="sign.reminded">{{sign.refuse}}</button>
						<button	class="btn btn-outline-primary" v-if="!sign.readed"  disabled="disabled">{{sign.opr}}</button>
						
						<button	class="btn btn-outline-primary" @click="detail(sign.userIdGym)">查看详情</button>
					</tr>
				</tbody>
			</table>
			
			<div class="row">
				<div class="offset-md-5">
					<ul class="pagination">
						<li class="page-item"><a class="page-link" href="#"
							@click.prevent="prePage"> <</a></li>
						<li class="page-item" v-for="(item, index) in pageNum"><a
							class="page-link" href="#" v-on:click.prevent="getSigns(item)"
							:class="{active: currentPage==index+1}">{{ index+1 }}</a></li>
						<li class="page-item"><a class="page-link" href="#"
							v-on:click.prevent="nextPage">></a></li>
					</ul>
				</div>
			</div>
		</div>
		<div v-else class="row">
			<p class="offset-md-5">您还没有签约信息</p>
		</div>
	</div>
</body>
<script type="text/javascript">
	new Vue({
		el:"#all",
		data:{
			signs:[],
			pageNum:0,
			currentPage:0,
			active:"",
			success:"success"
		},
		mounted(){
			this.getSigns(1);
		},
		methods:{
			getSigns:function(page){
				axios.get("/coach/getSigns?page="+page)
				.then(
					res => {
						if(res.data.code==1){
							var signs=res.data.data.list;			
							if(signs!=null){
								signs.forEach(el => {
										el.reminded =false;		
										el.readed=true;
										el.remindAccept = "提醒ta接受";
										el.accept = "接受";		
										el.refuse = "拒绝";
										el.opr="";
								})
							}
							
							this.signs = signs;
							this.currentPage = res.data.data.nowPage;
							this.pageNum = res.data.data.totalPage;
						}else{
							layer.alert("服务器忙，请稍后再试");
						}
					}
				
				)
			},
			detail:function(id){
				location.href="/lsw/gym_view.html?id="+id;
			},
			remindAccept:function(sign){
				var params =new URLSearchParams;
				params.append("userIdSender",sign.userIdCoach);
				params.append("userIdAccepter",sign.userIdGym);
				params.append("content",sign.user.nickname+"，有我的帮助贵馆一定如虎添翼，点击接受增加一员猛将！");
				params.append("messageStatus","2");
				params.append("sginId",sign.id);
				axios({
					url:"/coach/remind",
					method:"post",
					data:params
				}).then(
					res => {
						if(res.data.code==200){
							//修改该button的样式并禁用
							sign.remindPay="已提醒";
							sign.reminded=true;
							layer.msg("已提醒成功");
							sign.remindAccept = "已提醒接受";	
						}else{
							layer.msg(res.data.msg);
						}
					}
				)
			},
			accept:function(sign){
				var params =new URLSearchParams;
				params.append("id",sign.id);
				params.append("userIdGym",sign.userIdGym);
				params.append("userIdCoach",sign.userIdCoach);
				
				axios({
						url:"/coach/acceptSign",
						method:"post"	,
						data:params
				}).then(
				res =>{
					if(res.data.code==200){
						//修改该button的样式并禁用
						sign.readed=false;
						layer.msg("已接受该馆招聘");
						sign.opr = "已接受";
					}else{
						layer.msg(res.data.msg);
					}
				}		
				)
			},
				refuse:function(sign){			
					var params =new URLSearchParams;
					params.append("id",sign.id);
					params.append("userIdGym",sign.userIdGym);
					params.append("userIdCoach",sign.userIdCoach);
					
					axios({
							url:"/coach/refuseSign",
							method:"post"	,
							data:params
					}).then(
				res =>{
					if(res.data.code==200){
						//修改该button的样式并禁用
						sign.readed=false;
						layer.msg("已拒绝该馆招聘");
						sign.opr = "已接受";
					}else{
						layer.msg(res.data.msg);
					}
				}		
				)
			},
		
			prePage:function(){
				if(this.currentPage>1){
					this.getSigns(this.currentPage-1);
				}
			},
			nextPage:function(){
				if(this.currentPage<this.pageNum){
					this.getSigns(this.currentPage+1);
				}
			},
			
		
		}
	})
</script>
</html>